/* 
1.找接口
2.发送请求
3.将数据遍历


*/

// 渲染封装--------------------------
function ronder() {

    $.ajax({
        type: 'get',
        url: 'http://localhost:4444/api/getbook',
        success: function (res) {
            console.log(res)
            if (res.status === 200) {
                // 添加之前要清除
                $('tbody').empty()
                res.data.forEach((obj, index) => {

                    // console.log(res)
                    const theTr = `<tr>
                                <td>${obj.id}</td>
                                <td>${obj.bookname}</td>
                                <td>${obj.author}</td>
                                <td>${obj.publisher}</td>
                                <td><a href="javascript:;" id=${obj.id} class="btn btn-danger delete">删 除</a></td>
                            </tr>`

                    $('tbody').append(theTr)
                });
            }

        }
    })

}

ronder()
// setInterval(function () {
//     ronder()
// },2000)



// 添加   /api/addbook  ---------------------------------------------------------------------

$('#btnAdd').on('click', () => {
    // console.log(1111)
    const bookname = $('#iptBookname').val().trim()
    const Author = $('#iptAuthor').val().trim()
    const publisher = $('#iptPublisher').val().trim()

    if (bookname === '' || Author === '' || publisher === '') {
        return alert('输入内容不能为空！！！')
    }

    $.ajax({
        type: 'post',
        url: 'http://localhost:4444/api/addbook',
        data: `bookname=${bookname}&author=${Author}&publisher=${publisher}`,
        success: function (res) {
            // 添加成功
            if (res.status === 201) {
                // 重新渲染
                alert('添加成功！')
                ronder()
                // 渲染页面
                $('#iptBookname').val('')
                $('#iptAuthor').val('')
                $('#iptPublisher').val('')
            } else {
                return alert(`${res.msg}`)
            }
        }
    })

})


// 删除

$('#tb').on('click', 'a', function () {

    const id = $(this).attr('id')

    $.ajax({
        type: 'delete',
        url: `http://localhost:4444/api/delbook?id=${id}`,
        success: function (res) {
    
            if (res.status === 200) {
                alert(`${res.msg}`)
                ronder()
            } else {
                alert(`${res.msg}`)
                ronder()
            }
        }
    })

})